<? $this -> load -> view('header');?>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
<script language="JavaScript">

	 function initialize() {
        var mapDiv = document.getElementById('map-canvas');
        var map = new google.maps.Map(mapDiv, {

          center: new google.maps.LatLng(14.91, 102.89),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });
      }
      

      google.maps.event.addDomListener(window, 'load', initialize);
     
     function getGeography(){
			
		$('#geography').val("");
		$.get('<?=$current_module?>/geography', function(data) {
			var create = '<select id="dropdown_geolocation">';
			 create += '<option value="0">กรุณาเลือกภาค</option>';
			 $.each($.parseJSON(data), function() {
                create += '<option value="'+this.GEO_ID +'">'+this.GEO_NAME+'</option>';
		     });
		     create += '</select>';
		     $('#geography').html(create);
		     $('#dropdown_geolocation').change(function() {		
		     		$('#province').show();
		     		$('#province').val("");
		     		var createProvince = '<select id="dropdown_province">';
			 		createProvince += '<option value="0">กรุณาเลือกจังหวัด</option>';
		     		$.get('<?=$current_module?>/province',{geoid:$('#dropdown_geolocation').val()}, function(data) {
		     			$.each($.parseJSON(data), function() {
				             createProvince += '<option value="'+this.PROVINCE_ID +'">'+this.PROVINCE_NAME	+'</option>';
						 });
						createProvince += '</select>';
						$('#province').html(createProvince);
						   $('#dropdown_province').change(function() {	
						   	//amphur
						   	$('#amphur').show();
						   	$('#amphur').val("");
						
						   		$.get('<?=$current_module?>/amphur',{provinceid:$('#dropdown_province').val()}, function(data) {
						   			   	var createAmphur = '<select id="dropdown_amphur">';
			 				createAmphur += '<option value="0">กรุณาเลือกอำเภอ</option>';
				     				$.each($.parseJSON(data), function() {
				     					//alert(this.AMPHUR_ID );
						             	createAmphur += '<option value="'+this.AMPHUR_ID +'">'+this.AMPHUR_NAME	+'</option>';
									 });
									  createAmphur += '</select>';
								
									 $('#amphur').html(createAmphur);
									   $('#dropdown_amphur').change(function() {	
						 
						   				$('#district').show();
									   	$('#district').val("");
									   		$.get('<?=$current_module?>/district',{amphurid:$('#dropdown_amphur').val()}, function(data) {
									   			  	var createDistrict = '<select id="dropdown_district">';
									 				createDistrict += '<option value="0">กรุณาเลือกเขต</option>';
										     				$.each($.parseJSON(data), function() {
										     		
												             	createDistrict += '<option value="'+this.DISTRICT_ID +'">'+this.DISTRICT_NAME	+'</option>';
															 });
															  createDistrict += '</select>';
														
															 $('#district').html(createDistrict);
									   		});
									   });
												 
									 //district
								 });
								
						   });
		     		});
			 	
			});
		});
	
	
	}


	getGeography();


</script>
<div id="middle">
	<? $this -> load -> view('land/left_menu');?>
	<div id="center-column">
		<div class="top-bar">
			<h1>การเรียกดูข้อมูลที่ดินโดยแบ่งตามตำแหน่งที่ตั้ง</h1>
			 <div class="select-bar">
                   <span id="geography"><select id="dropdown_geolocation"></select></span>
	<span id="province"><select id="dropdown_province"></select></span>
	<span id="amphur"><select id="dropdown_amphur"></select></span>
	<span id="district"><select id="dropdown_district"></select></span>
              </div>
		
		</div>
		<div class="table">
			<div id="map-canvas" style="width: 100%; height: 40%"></div>
			<table class="listing" cellpadding="0" cellspacing="0">
				<tr>
					<td colspan="2" class="full" >Owner Detail</td>
				</tr>
				<tr>
					<td>Member ID:</td>
					<td>xxxxxxxx</td>
				</tr>
				<tr>
					<td>ชื่อ นามสกุล:</td>
					<td>xxxxxxxx</td>
				</tr>
				<tr>
					<td>ที่อยู่:</td>
					<td>xxxxxxxx</td>
				</tr>
				<tr>
					<td>ประเภทพื้นที่:</td>
					<td>เช่า</td>
				</tr>
				<tr>
					<td>กลุ่มสมาชิก:</td>
					<td>xxxxx</td>
				</tr>
				
			</table>
		</div>
	
	</div>
	<div id="right-column">
		<strong class="h">Quick Info</strong>
		<div class="box" >
			<span id="user_infor">
				พื้นที่เพาะปลูก
			</span>
		</div>
	</div>
</div>
<? $this -> load -> view('footer');?>